import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { Select } from 'antd';
import { BaseComponent } from 'fe-lib';

/* eslint-disable */
class LabelSelect extends BaseComponent {
    constructor(props) {
        super(props);
        super.bind('handlerChange');
    }

    handlerChange(value) {
        const { onChange, mode } = this.props;
        let active;
        if (mode === 'multiple') {
            active = [];
            if (value) {
                value.map(item => active.push({ id: item.key, name: item.label }));
            }
        } else {
            active = { id: value.key, name: value.label };
        }
        onChange && onChange(active);
    }

    render() {
        const { options, value, mode } = this.props;
        let active;
        if (mode === 'multiple') {
            active = [];
            if (value && Array.isArray(value)) {
                value.map(item => active.push({ key: item.id, label: item.name }));
            }
        } else {
            active = value ? { key: value.id, label: value.name } : undefined;
        }

        return <Select
            value={active}
            onChange={this.handlerChange}
            labelInValue
            mode={mode}
            placeholder="请选择"
        >
            {
                options && options.map(option => <Select.Option key={option.id} value={option.id}>{option.name}</Select.Option>)
            }
        </Select>;

    }
}

export default LabelSelect;
